import { FC, useRef, useState, forwardRef, useImperativeHandle } from "react";

interface PropsSon {
  a: string;
  b: number;
}
const Son = forwardRef((props: PropsSon, ref) => {
  const [num1] = useState(1);
  const [num2] = useState(2);

  useImperativeHandle(ref, () => {
    return {
      a: 1,
      b: 2,
      num1,
      num2,
    };
  });
  return (
    <fieldset>
      <legend>Son</legend>
    </fieldset>
  );
});

interface Props {}
const Index: FC<Props> = () => {
  const sonRef: React.MutableRefObject<{
    a: number;
    b: number;
    num1: number;
    num2: number;
  } | null> = useRef(null);
  return (
    <fieldset>
      <legend>08-父操作子</legend>

      <button
        onClick={() => {
          console.log("子组件数据：", sonRef.current);
        }}
      >
        打印子组件数据
      </button>

      <Son ref={sonRef} a="1" b={2} />
    </fieldset>
  );
};

export default Index;
